<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="./vue.js"></script>
	</head>
	<body>
		<div id="app">
			<input type="text" v-model="msg"/>
			<div id="display" style="border: 3px solid darkseagreen;">
				{{msgs}}
			</div>
		</div>
		<script>
		 var vm=new Vue({
			 el:'#app',
			 data:{
				 msg:null,
				 msgs:[]
			 },
			 beforeCreate() {
			 	console.log("页面正在初始化中");
			 },
			 created() {
			 	if(this.msgs.length==0)
					this.msg="还没有消息";
			 },
			 mounted(){
				 //alert("改边框");
				 document.getElementById("display").style.border="10px dashed red";
			 },
			  beforeUpdate() {
			  	this.msgs.push(this.msg);
			  },
			 /* updated() {
			 	this.msgs.push(this.msg);
			 } */
			 
		 })
		</script>
	</body>
</html>
